<template>
	<view class="container">
		<view class="menu-item" @click="navigateTo('feedback')">
			<text>问题反馈</text>
		</view>
		<view class="menu-item" @click="navigateTo('introduction')">
			<text>平台介绍</text>
		</view>
		<view class="menu-item" @click="navigateTo('developer')">
			<text>开发者</text>
		</view>
		<view class="menu-item" @click="navigateTo('about')">
			<text>关于我们</text>
		</view>
		<view class="menu-item" @click="navigateTo('account')">
			<text>账户管理</text>
		</view>
		<view class="menu-item logout" @click="logout">
			<text>退出登录</text>
		</view>
	</view>
</template>

<script>
	export default {
		methods: {
			navigateTo(page) {
				// 这里可以根据实际情况进行页面跳转
				uni.navigateTo({
					url: '/pages/content/' + page + '/' + page
				})
				console.log(`Navigate to ${page}`);
			},
			logout() {
				// 退出登录的逻辑
				uni.showModal({
					title: '退出登录',
					content: '确定要退出登录吗？',
					success: (res) => {
						if (res.confirm) {
							// 清除本地存储数据
							// 根据不同平台使用不同的方法
							// #ifdef H5
							localStorage.clear();
							// #endif
							// #ifdef MP-WEIXIN
							wx.clearStorageSync();
							// #endif
							// 如果有全局状态管理，比如Vuex，则更新状态
							// this.$store.commit('logout');
							// 跳转页面到登录页面
							uni.reLaunch({ // 使用reLaunch关闭所有页面，跳转到登录页
								url: '/pages/index/index'
							});
						}
					}
				});
			}
		}
	}
</script>

<style>
	.container {
		display: flex;
		flex-direction: column;
		align-items: center;
		background-color: #f8f8f8;
		padding: 20px;
		height: 100%;
	}
	.menu-item {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 50px;
		margin-bottom: 30rpx;
		background-color: #ffffff;
		border-radius: 8px;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
		font-size: 18px;
	}
	.logout {
		background-color: #ff4d4f;
		color: #ffffff;
	}
	.menu-item text {
		font-weight: 500;
	}
</style>